<!DOCTYPE html>
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
	<title>qx-base</title>
	<link href="../source/css/qx-base.css" rel="stylesheet">
	<style type="text/css">
		.container{
			width:1170px;
			margin:18px auto;
		}
	</style>
</head>
<body>
<div class="container">
	<h1 id="链接">链接 <small>&lt;a&gt;</small></h1>
	<hr>
	<a href="#">zhaoff@qidapp.com</a>
	<br><br>

	<h1 id="标题">标题  <small>&lt;h1&gt; &lt;h2&gt; etc</small></h1>
	<hr>
	<h1>h1. Heading 1</h1>
	<h2>h2. Heading 2</h2>
	<h3>h3. Heading 3</h3>
	<h4>h4. Heading 4</h4>
	<h5>h5. Heading 5</h5>
	<h6>h6. Heading 6</h6>
	<br><br>

	<h1 id="列表">列表 <small>&lt;ol&gt; &lt;ul&gt;</small></h1>
	<hr>
	<ol>
		<li>
			1
			<ol>
				<li>1.1</li>
				<li>1.2</li>
			</ol>
		</li>
		<li>2</li>
		<li>3</li>
	</ol>
	<ul>
		<li>
			1
			<ul>
				<li>1.1</li>
				<li>1.2</li>
			</ul>
		</li>
		<li>2</li>
		<li>
			3
			<ol>
				<li>3.1</li>
				<li>3.2</li>
			</ol>
		</li>
	</ul>
	<br><br>

	<h1 id="表单">表单 <small>&lt;form&gt;</small></h1>
	<hr>
	<table cellpadding="6">
	<tbody>
		<tr>
			<td width="40"><label>姓名</label></td>
			<td>
				<input type="text" value="abb" class="small">
			</td>
		</tr>
		<tr>
			<td width="50"><label>性别</label></td>
			<td>
				<select class="mini">
					<option>男</option>
					<option>女</option>
				</select>
			</td>
		</tr>
		<tr>
			<td width="50"><label>配偶</label></td>
			<td>
				<label>
					<input type="radio" name="aaa">
					有
				</label>
				<label>
					<input type="radio" name="aaa">
					无
				</label>
			</td>
		</tr>
		<tr>
			<td width="50"><label>兴趣</label></td>
			<td>
				<label>
					<input type="checkbox">
					刷牙
				</label>
				<label>
					<input type="checkbox">
					洗脸
				</label>
				<label>
					<input type="checkbox">
					唱歌
				</label>
			</td>
		</tr>
		<tr>
			<td width="50"><label>简介</label></td>
			<td>
				<textarea class="large"></textarea>
			</td>
		</tr>
		<tr>
			<td width="40"><label>家庭住址</label></td>
			<td>
				<input type="text" value="abb" class="large">
			</td>
		</tr>
		<tr>
			<td></td>
			<td>
				<button class="btn btn-primary">提 交</button>
			</td>
		</tr>
	</tbody>
	</table>
	<br><br>
	
	<h1 id="表格">表格 <small>&lt;table&gt;</small></h1>
	<hr>
	<table class="table">
		<thead>
			<tr>
				<th>姓名</th>
				<th>性别</th>
				<th>简介</th>
			</tr>
		</thead>
		<tbody>
			<tr class="nth">
				<td>1</td>
				<td>2</td>
				<td>3</td>
			</tr>
			<tr>
				<td>1</td>
				<td>2</td>
				<td>3</td>
			</tr>
		</tbody>
	</table>
	<table class="table table-border table-condens">
		<thead>
			<tr>
				<th>姓名</th>
				<th>性别</th>
				<th>简介</th>
			</tr>
		</thead>
		<tbody>
			<tr class="nth">
				<td>1</td>
				<td>2</td>
				<td>3</td>
			</tr>
			<tr>
				<td>1</td>
				<td>2</td>
				<td>3</td>
			</tr>
		</tbody>
	</table>
	<br><br>
	
	<h1 id="按钮">按钮 <small>&lt;button&gt;</small></h1>
	<hr>
	<button class="btn">默认按钮</button>
	<button class="btn btn-primary">主按钮</button>
	<button class="btn btn-danger">危险操作</button>
	<br><br>
	<button class="btn btn-large">默认按钮</button>
	<button class="btn btn-primary btn-large">主按钮</button>
	<button class="btn btn-danger btn-large">危险操作</button>
	<br><br>
	
	<h1 id="提示">提示</h1>
	<hr>
	<table width="100%">
		<tbody>
			<tr>
				<td width="25%">
					<div class="alert"><b>default</b> 您当前的上架分布情况一般，建议您在1-2周后使用上架计划重新调整上架。</div>
				</td>
				<td width="25%">
					<div class="alert alert-warn"><b>warn</b> 您当前的上架分布情况一般，建议您在1-2周后使用上架计划重新调整上架。</div>
				</td>
				<td width="25%">
					<div class="alert alert-succ"><b>succ</b> 您当前的上架分布情况一般，建议您在1-2周后使用上架计划重新调整上架。</div>
				</td>
				<td width="25%">
					<div class="alert alert-info"><b>info</b> 您当前的上架分布情况一般，建议您在1-2周后使用上架计划重新调整上架。</div>
				</td>
			</tr>
			<tr>
				<td colspan="2">
					<div class="alert alert-info alert-close"><b>info close</b> 您当前的上架分布情况一般，建议您在1-2周后使用上架计划重新调整上架。<a class="close">&times;</a></div>
				</td>
				<td></td>
				<td></td>
			</tr>
		</tbody>
	</table>
</div>
</body>
</html>